<!DOCTYPE html>
<html>
    <head>
        <title>AUI Toggler Delegate Unit Tests</title>
        <script src="../../../../build/aui/aui.js"></script>
        <script src="js/toggler-delegate-tests.js"></script>
        <meta charset="utf-8" />

        <style type="text/css">
            #toggler-container div {
                margin-left: 20px;
            }

            .content {
                margin-bottom: 10px;
            }
        </style>
    </head>
    <body class="yui3-skin-sam">
        <div id="logger"></div>

        <script>
            YUI({
                coverage: ['aui-toggler-delegate'],
                filter: (window.location.search.match(/[?&]filter=([^&]+)/) || [])[1] || 'raw'
            }).use('dd-plugin', 'test-console', 'aui-toggler-delegate-tests', 'test', function(Y) {

                (new Y.Console(
                    {
                        entryTemplate: '<pre class="{entry_class} {cat_class} {src_class}">'+
                                '<span class="{entry_cat_class}">{label}</span>'+
                                '<span class="{entry_content_class}">{message}</span>'+
                        '</pre>',
                        filters:
                        {
                            pass: true
                        },
                        newestOnTop : false
                    }
                )).plug(
                    Y.Plugin.Drag,
                    {
                        handles: ['.yui3-console-hd']
                    }
                ).render('#logger');

                Y.Test.Runner.setName('aui-toggler-delegate');
                Y.Test.Runner.run();
            });
        </script>

        <div id="toggler-container">
            <div class="header" data-level="0">
                <a href="#">header_0</a>
            </div>
            <div class="content">
                <div>
                    <div>Content 0</div>
                    <div class="header" data-level="0_0">
                        <a href="#">header_0_0</a>
                    </div>
                    <div class="content">
                        <div>
                            <div>Content 0_0</div>
                            <div class="header" data-level="0_0_0">
                                <a href="#">header_0_0_0</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_0_0</div>
                                </div>
                            </div>

                            <div class="header" data-level="0_0_1">
                                <a href="#">header_0_0_1</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_0_1</div>
                                </div>
                            </div>

                            <div class="header" data-level="0_0_2">
                                <a href="#">header_0_0_2</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_0_2</div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="header" data-level="0_1">
                        <a href="#">header_0_1</a>
                    </div>
                    <div class="content">
                        <div>
                            <div>Content 0_1</div>
                            <div class="header" data-level="0_1_0">
                                <a href="#">header_0_1_0</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_1_0</div>
                                </div>
                            </div>

                            <div class="header" data-level="0_1_1">
                                <a href="#">header_0_1_1</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_1_1</div>
                                </div>
                            </div>

                            <div class="header" data-level="0_1_2">
                                <a href="#">header_0_1_2</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_1_2</div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="header" data-level="0_2">
                        <a href="#">header_0_2</a>
                    </div>
                    <div class="content">
                        <div>
                            <div>Content 1</div>
                            <div class="header" data-level="0_2_0">
                                <a href="#">header_0_2_0</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_2_0</div>
                                </div>
                            </div>

                            <div class="header" data-level="0_2_1">
                                <a href="#">header_0_2_1</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_2_1</div>
                                </div>
                            </div>

                            <div class="header" data-level="0_2_2">
                                <a href="#">header_0_2_2</a>
                            </div>
                            <div class="content">
                                <div>
                                    <div>Content 0_2_2</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>
